<template>
	<view class="wrap bg-fff">
        <button class="shareBtn" type="default" open-type="share">
            <image class="joinImg top-20" src="https://image.srea.org.cn/xcx/adviser-join-top.gif" mode="widthFix"></image>
        </button>
        <view class="cardBox top-20">
            <view class="feedItem">
                <view class="feedContent flex">
                    <view class="imgItem flex">
                        <image src="https://image.srea.org.cn/xcx/card-example.jpg" mode="aspectFill"></image>
                    </view>
                    <u-button :custom-style="customStyle" @click="uploadImgBtn">上传名片或工牌</u-button>
                    <view class="tips">
                        请参照示例将名片或工牌放入框内
                    </view>
                </view>
            </view>
        </view>
        <up-modal :show="showPrivacy" title="用户隐私保护提示" :showCloseBtn="false" :showConfirmButton="false" :closeOnClickOverlay="true" @close="showPrivacy = false" @confirm="showPrivacy = false">
            <privacy-authorize @close="closePrivacyModal"></privacy-authorize>
        </up-modal>
	</view>
</template>

<script>
import { mapState, mapActions } from 'pinia';
import { useIndexStore, useUserInfoStore, useConfigStore } from '@/store/index';
import { checkLogin, checkUserInfo, checkWXPrivacyAuthorize, checkUploadDistParam, uuid, getFileType, upload_image } from '@/common/common';
import { distinguishMsg, adviserExamine } from '@/common/api';
export default {
	data() {
		return {
            customStyle: {
                backgroundColor: '#007235', // 注意驼峰命名，并且值必须用引号包括，因为这是对象
                marginTop: '40rpx',
                width: '92vw',
                color: '#ffffff',
                border: 'none'
            },
            cardImg: {},
            cityCode: '',
            showPrivacy: false
		};
	},
	onLoad(options) {
        let that = this;
        let { puid = '' } = options;
        if (puid) {
            this.setPuid(puid)
        }
       
        this.cityCode = this.nowCityCode

        uni.$check_and_login(function() {
            that.init();
        })
	},
	computed: {
        ...mapState(useIndexStore, ['uploadDistParam', 'nowCityCode']),
        ...mapState(useUserInfoStore, ['userInfo']),
	},
    //分享
    onShareAppMessage(res) {
    	return {
    		title: '邀您入驻顾问之家',
    		path: `/pages/my/adviser/adviser-join?cityCode=${this.cityCode}`,
    	}
    },
	methods: {
        ...mapActions(useIndexStore, ['setAdviserCardData']),
        ...mapActions(useConfigStore, ['setPuid']),
        async init(){
            await checkUploadDistParam();
            let examineRes = await adviserExamine();
            if(examineRes.status == 0) {
                //置业顾问状态  0:审核中  1:审核成功 2:审核失败 3:从未申请
                switch(examineRes.detail.check) {
                    case 1:
                        uni.switchTab({
                            url: '/pages/tabBar/my/index'
                        })
                        break;
                    default:
                        uni.navigateTo({
                            url: "/pages/my/adviser/adviser-status"
                        })
                }
            }
        },

        //关闭隐私政策模态框
        closePrivacyModal() {
            this.showPrivacy = false;
        },

        //上传图片
        async uploadImgBtn(){
        	const that = this;
            if(!checkLogin()) {
                uni.navigateTo({
                    url: '/pages/login/login'
                })
                return
            }
            if(!checkUserInfo()) {
                uni.navigateTo({
                    url: `/pages/login/user-info-form`
                })
                return
            }
            let privacyRes = await checkWXPrivacyAuthorize();
            if(privacyRes) {
                this.showPrivacy = true;
                return
            }
        	uni.chooseMedia({
        		count: 1, //默认9
                mediaType: ['image'],
        		success: (res) => {
        			let fileObj = {};
        			res.tempFiles.forEach(item => {
        				let name = `adviser/${that.userInfo.id}/${uuid()}${getFileType(item.tempFilePath)}`;
                        fileObj = {url: item.tempFilePath, key: name}
        			})
                    upload_image(that.uploadDistParam, fileObj.url, fileObj.key, function(res, key){
                        //查找对应的图片
                        that.cardImg = fileObj;
                        that.transformMsg();
                    });
        		}
        	});
        },

        //图片识别
        transformMsg(){
            uni.showLoading({
            	title: '图片识别中',
            	mask: true
            })
            const that = this;
            distinguishMsg({image: that.cardImg.key}).then(res => {
                if(res.status == 0) {
                    uni.hideLoading();
                    if(res.detail.name) {
                        this.setAdviserCardData({...res.detail, ...{card_url: [that.cardImg], city_code: that.cityCode}})
                        uni.navigateTo({
                            url: `/pages/my/adviser/adviser-form`
                        })
                    }else {
                        uni.showToast({
                            icon: 'none',
                            duration: 2000,
                            title: '请上传有效名片或工牌'
                        });
                    }
                }else{
                    uni.hideLoading();
                    uni.$u.toast(res.detail);
                }
            }).catch(err => {
                uni.hideLoading();
            })
        }
	}
};
</script>

<style scoped lang="scss">
.wrap {
    min-height: 100vh;
    overflow: hidden;
	padding: 0rpx 30rpx;
    .shareBtn{
        width: 100%;
        flex-direction: column;
        background: none;
        padding: 0;
        margin: 0;
        line-height: 1;
        &::after{
            border: none;
        }
    }
    .joinImg{
        width: 100%;
    }
    .feedItem{
    	margin-bottom: 40rpx;
    	.feedContent{
    		flex-wrap: wrap;
    		.imgItem{
    			width: 100%;
    			height: 400rpx;
    			border: 1rpx dashed #999999;
    			border-radius: 10rpx;
    			overflow: hidden;
    			margin-top: 20rpx;
    			position: relative;
    			image{
    				width: 100%;
    				height: 100%;
    			}
    		}
            .tips{
                width: 100%;
                margin-top: 20rpx;
                text-align: center;
                color: #FF2000;
            }
    	}
    }
}
</style>
